<template>
    <FormItem :label="label" :prop="prop" class="ui-form-desc-group">
        <div class="ui-form-desc-group__input">
            <slot style="width: 300px;"></slot>
        </div>
        <div class="ui-form-desc-group__text">
            <slot name="desc">{{ desc }}</slot>
        </div>
   </FormItem>
</template>

<script>
export default {
    name: 'PromptFromItem',
    props: {
        label: {
            type: String,
            default: ''
        },
        prop: {
            type: String,
            default: ''
        },
        desc: {
        	type: String,
            default: ''
        }
    },
    data() {
        return {
            
        }
    }
}
</script>

<style>
.ui-form-desc-group {
    display: table;
    width: 100%;
}
.ui-form-desc-group .ui-form-desc-group__input, .ui-form-desc-group .ui-form-desc-group__text {
    display: table-cell;
}
.ui-form-desc-group .ui-form-desc-group__input {
    min-width: 400px;
    vertical-align: top;
}
.ui-form-desc-group .ui-form-desc-group__input > div {
    vertical-align: top;
    width: 300px;
}
.ui-form-desc-group .ui-form-desc-group__text {
    padding-left: 20px;
    padding-top: 8px;
    vertical-align: top;
    /*vertical-align: middle;*/
    color: #787878;
    line-height: 16px;
}
</style>